<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>购物车案例</title>
		<script src="js/jQuery.js"></script>
		<script src="js/index.js"></script>
		<link rel="stylesheet" href="css/index.css" />
	</head>
	<body>
		<div class="container">
			<div class="mode">购 &nbsp;物 &nbsp;车</div>
			<div class="commodity">
				<input type="checkbox" name="" id="check" class="check" />
				<div class="box">
					<span><img src="image/06e7e7384f0a00db.jpg.webp" alt="" /></span>
					电饭煲,
					新鲜的电饭煲,不粘锅，好用还好吃，价格只要998￥,好用的电饭煲带回家，心动不如行动，快来抢购吧！
				</div>
				<!-- 信息模块 -->
				<div class="infromation">
					<div class="price">￥998.99</div>
					<div class="amount">
						<ul class="amount_num">
							<li class="reduce">-</li>
							<li>
								<input type="text" name="" id="" class="input_val" value="0" />
							</li>
							<li style="border-right: 0" class="add">+</li>
						</ul>
					</div>
					<div class="sun">￥ 0</div>
					<div class="remove"><a href="javascript:;">删除</a></div>
				</div>
			</div>
			<div class="commodity">
				<input type="checkbox" name="" id="check" class="check" />
				<div class="box">
					<span><img src="image/82664a354f494068.jpg.webp" alt="" /></span>
					电饭煲,
					新鲜的电饭煲,不粘锅，好用还好吃，价格只要998￥,好用的电饭煲带回家，心动不如行动，快来抢购吧！
				</div>
				<!-- 信息模块 -->
				<div class="infromation">
					<div class="price">￥ 28.90</div>
					<div class="amount">
						<ul class="amount_num">
							<li class="reduce">-</li>
							<li>
								<input type="text" name="" id="" class="input_val" value="0" />
							</li>
							<li style="border-right: 0" class="add">+</li>
						</ul>
					</div>
					<div class="sun">￥ 0</div>
					<div class="remove"><a href="javascript:;">删除</a></div>
				</div>
			</div>
			<div class="commodity">
				<input type="checkbox" name="" id="check" class="check" />
				<div class="box">
					<span><img src="image/b367cf77ce584b02.jpg.webp" alt="" /></span>
					电饭煲,
					新鲜的电饭煲,不粘锅，好用还好吃，价格只要998￥,好用的电饭煲带回家，心动不如行动，快来抢购吧！
				</div>
				<!-- 信息模块 -->
				<div class="infromation">
					<div class="price">￥ 12.90</div>
					<div class="amount">
						<ul class="amount_num">
							<li class="reduce">-</li>
							<li>
								<input type="text" name="" id="" class="input_val" value="0" />
							</li>
							<li style="border-right: 0" class="add">+</li>
						</ul>
					</div>
					<div class="sun">￥ 0</div>
					<div class="remove"><a href="javascript:;">删除</a></div>
				</div>
			</div>
			<div class="commodity">
				<input type="checkbox" name="" id="check" class="check" />
				<div class="box">
					<span><img src="image/d02ac3899868afb9.jpg.webp" alt="" /></span>
					电饭煲,
					新鲜的电饭煲,不粘锅，好用还好吃，价格只要998￥,好用的电饭煲带回家，心动不如行动，快来抢购吧！
				</div>
				<!-- 信息模块 -->
				<div class="infromation">
					<div class="price">￥ 9.90</div>
					<div class="amount">
						<ul class="amount_num">
							<li class="reduce">-</li>
							<li>
								<input type="text" name="" id="" class="input_val" value="0" />
							</li>
							<li style="border-right: 0" class="add">+</li>
						</ul>
					</div>
					<div class="sun">￥ 0</div>
					<div class="remove"><a href="javascript:;">删除</a></div>
				</div>
			</div>
			<div class="commodity">
				<input type="checkbox" name="" id="check" class="check" />
				<div class="box">
					<span><img src="image/de4b532af368891c.jpg.webp" alt="" /></span>
					电饭煲,
					新鲜的电饭煲,不粘锅，好用还好吃，价格只要998￥,好用的电饭煲带回家，心动不如行动，快来抢购吧！
				</div>
				<!-- 信息模块 -->
				<div class="infromation">
					<div class="price">￥ 98.90</div>
					<div class="amount">
						<ul class="amount_num">
							<li class="reduce">-</li>
							<li>
								<input type="text" name="" id="" class="input_val" value="0" />
							</li>
							<li style="border-right: 0" class="add">+</li>
						</ul>
					</div>
					<div class="sun">￥ 0</div>
					<div class="remove"><a href="javascript:;">删除</a></div>
				</div>
			</div>
			<!-- 结算模块 -->
			<div class="settlement">
				<input type="checkbox" name="" id="checked_all" /> 全选
				<span class="delete">删除选中商品</span>
				<span class="emoty">清空购物车</span>
				<div class="money">
					<p>
						已选中<span class="num">0</span>件商品 总价<span class="money_sun"
							>￥0.00</span
						>
					</p>
					<span>去结算</span>
				</div>
			</div>
		</div>
	</body>
</html>
